<html>
  <head>
    <title>布局零件</title>
  </head>
  <body>
    <script>
      /*
           4、布局零件  Layout Parts 

                                                一个典型的布局由几个部分组成。主题应该包括么个布局中必要的部分。

                                                eg: 基本主题具有应用程序布局的以下部分：


                                                应用程序代码和模块只能显示页面内容部分的内容。

                                                如果他们需要更改其他部分 (添加菜单项、添加工具栏项、更改品牌区域中的应用程序名称)，应该使用ABP Api。



                                                以下部分解释了ABP预先定义的基本部分，并且可以通过主题实现。

                                                (1)、品牌化  Branding

                                                        IBrandingProvider服务应用于获取要在品牌部分呈现的应用程序的名称和徽标URL。

                                                        Application Startup Template有一个此接口的实现，用于由应用程序开发人员设置值。
                                                        

                                                (2)、主菜单  Main Menu

                                                         IMenuManager服务用于获取主菜单项并在布局上呈现。

                                                         eg:  获取要在视图组件中呈现的主菜单

                                                                // 主菜单视图组件
                                                                public class MainNavbarMenuViewComponent : AbpViewComponent
                                                                {
                                                                        private readonly IMenuManager _menuManager;

                                                                        public MainNavbarMenuViewComponent(IMenuManager menuManager)
                                                                        {
                                                                                _menuManager = menuManager; // 注入菜单管理器
                                                                        }

                                                                        public async Task<IViewComponentResult> InvokeAsync()
                                                                        {
                                                                                var menu = await _menuManager.GetAsync(StandardMenus.Main);
                                                                                return View("~/Themes/Basic/Components/Menu/Default.cshtml", menu);
                                                                        }
                                                                }

                                                         请参阅导航/菜单文档以了解有关导航系统的更多信息。

                                                (3)、主工具栏  Main ToolBar

                                                          IToolbarManager服务用于获取主工具栏项目并在布局上呈现。

                                                          此工具栏的每个项目都是一个视图组件，因此它可能包含任何类型的UI元素。
                                                          
                                                          注入IToolbarManager并使用GetAsync获取工具栏项目：

                                                                var toolbar = await _toolbarManager.GetAsync(StandardToolbars.Main);

                                                          该主题有责任将两个预定义的项目添加到主工具栏：语言选择和用户菜单。

                                                          为此，请创建一个实现IToolbarContributor接口的类并将其添加到AbpToolbarOptions，如下所示：

                                                                Configure<AbpToolbarOptions>(options =>
                                                                {
                                                                        options.Contributors.Add(new BasicThemeMainTopToolbarContributor());
                                                                });

                                                           ①、 语言选择  Language Selection

                                                                   语言选择工具栏项通常是用于在语言之间切换的下拉列表。
                                                                   
                                                                   ILanguageProvider用于获取可用语言列表，CultureInfo.CurrentUICulture用于学习当前语言。

                                                                   /Abp/Languages/Switch端点可用于切换语言此端点接受以下查询字符串参数：

                                                                        culture：选定的区域性，如en-US或en。

                                                                        uiCulture：选定的UI文化，如en-US或en。

                                                                        returnUrl（可选）：可用于切换语言后返回给定的URL。

                                                                   culture和uiCulture应匹配可用语言之一。ABP在/Abp/Languages/Switch端点中设置文化cookie。


                                                            ②、用户菜单  
                                                                     
                                                                    用户菜单包括与用户帐户相关的链接。
                                                                    
                                                                    IMenuManager与主菜单一样使用，但这次使用StandardMenus.User参数，如下所示：

                                                                        var menu = await _menuManager.GetAsync(StandardMenus.User);

                                                                     ICurrentUser和ICurrent租户服务可用于获取当前用户和租户名称。

                                                (4)、页面提醒  Page Alerts

                                                            IAlertManager服务用于获取要在布局上呈现的当前页面警报。

                                                            使用IAlertManager的Alerts列表。

                                                            它通常在页面内容之前呈现（RenderBody()）。


                                                (5)、布局挂钩  Layout Hooks

                                                             由于Layout在主题包中，因此最终应用程序或任何模块都不能直接操作布局内容。

                                                             Layout Hook系统允许将组件注入布局的某些特定点。

                                                             主题负责在正确的位置渲染钩子。

                                                             eg： 在应用程序布局中呈现LayoutHooks.Head.First钩子

                                                                    <head>
                                                                        @await Component.InvokeLayoutHookAsync(LayoutHooks.Head.First, StandardLayouts.Application)
                                                                        ... 
                                                        
                                                (6)、脚本、样式   Script / Style Sections

                                                             每个布局都应呈现以下可选部分：

                                                                        styles部分呈现在head的末尾，就在LayoutHooks.Head.Last之前。

                                                                        scripts部分呈现在body的末尾，就在LayoutHooks.Body.Last之前。

                                                              这样，页面就可以将样式和脚本导入到布局中。
                                                                        
                                                                        eg:  呈现styles部分
                                                                        
                                                                        @await RenderSectionAsync("styles", required: false)

                                                (7)、内容工具栏 

                                                             另一个预定义的部分是Content Toolbar部分，页面可以使用它在页面内容之前添加代码。

                                                             基本主题呈现如下所示：

                                                                        <div id="AbpContentToolbar">
                                                                                <div class="text-end mb-2">
                                                                                        @RenderSection("content_toolbar", false)
                                                                                </div>
                                                                        </div>  

                                                              容器div的id必须是AbpContentToolbar。此部分应位于RenderBody()之前。


                                                (8)、小部件资源  Widget Resourse 

                                                              Widget System允许使用自己的样式/脚本文件定义可重用的小部件。
                                                              
                                                              所有布局都应呈现小部件样式和脚本。

                                                              小部件样式呈现如下所示，就在styles部分之前，在全局样式包之后：

                                                                       @await Component.InvokeAsync(typeof(WidgetStylesViewComponent))
                                                                       
                                                              小部件脚本呈现如下所示，就在scripts部分之前，在全局脚本包之后：

                                                                        @await Component.InvokeAsync(typeof(WidgetScriptsViewComponent))

                                                (9)、ABP  Script  

                                                              ABP有一些特殊的脚本，应该包含在每个布局中。它们不包含在全局包中，因为它们是根据当前用户动态创建的。

                                                              ABP脚本（ApplicationConfigurationScript和ServiceProxyScript）应该在全局脚本包之后添加，如下所示：

                                                                      <script src="~/Abp/ApplicationConfigurationScript"><//script>
                                                                      < src="~/Abp/ServiceProxyScript"><//script>  

                                                (10)、页面标题、选定的菜单项和面包屑

                                                               IPageLayout服务可以被任何页面注入以设置页面标题、选定的菜单项名称和面包屑项。
                                                               
                                                               然后主题可以使用此服务获取这些值并在UI上呈现。

                                                               基本主题没有实现此服务，但Lepton主题实现了：


                                                (11)、租户切换

                                                                
                                                                如果应用程序是多租户并且租户是从cookie中解析的，则帐户布局应允许用户切换当前租户。请参阅基本主题帐户布局作为示例实现。

      */
    </script>
  </body>
</html>